<template>
  <div>
    <el-dialog
      :title="title"
      :visible.sync="drawerShow"
      :destroy-on-close="true"
      width="700px"
    >
      <div class="drawer-content">
        <el-form v-if="dataBody" ref="form" :model="dataBody" class="pl10 pr10" label-width="110px">
          <el-form-item label="华为会议室ID">
            <span>{{ dataBody.huaweId }}</span>
          </el-form-item>
          <el-form-item label="会议室名称">
            <span>{{ dataBody.roomName }}</span>
          </el-form-item>
          <template v-if="editFlag">
            <!-- <el-form-item label="是否平台自有" prop="status">
              <el-switch v-model="dataBody.isPlatform" active-color="#13ce66" inactive-color="#ff4949"
                :active-value="1" :inactive-value="0">
              </el-switch>
              {{dataBody.isPlatform == 1 ? '是' : '否'}}
            </el-form-item> -->
            <!-- <el-form-item label="所属企业" prop="companyId" v-if="dataBody.isPlatform == 0">
              <el-select v-model="dataBody.companyId" clearable style="width: 400px;" placeholder="请选择">
                <el-option v-for="(item,index) in companyList" :key="index" :label="item.label" :value="item.value" />
              </el-select>
            </el-form-item> -->
            <el-form-item label="状态" prop="status">
              <el-switch v-model="dataBody.status" active-color="#13ce66" inactive-color="#ff4949"
                :active-value="1" :inactive-value="0">
              </el-switch>
              {{dataBody.status == 1 ? '开启' : '关闭'}}
            </el-form-item>
            <el-form-item label="购买有效时间" prop="datetimerange">
                <el-date-picker v-model="dataBody.datetimerange" type="datetimerange" style="width: 400px;" value-format="yyyy-MM-dd HH:mm" format="yyyy-MM-dd HH:mm"
                  range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期">
                </el-date-picker>
            </el-form-item>
          </template>
          <template v-else>
            <!-- <el-form-item label="是否平台自有">
              <span>{{ dataBody.isPlatform_dictText }}</span>
            </el-form-item>
            <el-form-item label="所属企业" v-if="dataBody.isPlatform == 0">
              <span>{{ dataBody.companyId_dictText }}</span>
            </el-form-item> -->
            <el-form-item label="状态">
              <span>{{ dataBody.status_dictText }}</span>
            </el-form-item>
            <el-form-item label="购买有效时间">
              <span>{{ dataBody.effectiveBeginTime }} ~ {{ dataBody.effectiveEndTime }}</span>
            </el-form-item>
            <el-form-item label="主持人链接">
              <span>{{ dataBody.hostUrl }}</span>
            </el-form-item>
            <el-form-item label="参与人链接">
              <span>{{ dataBody.playerUrl }}</span>
            </el-form-item>
          </template>
          <div v-if="isExamine" class="drawer-form-buttom-group">
            <el-button type="primary" @click="examineAction">确定</el-button>
            <el-button @click="drawerShow = false">取消</el-button>
          </div>
          <div v-else class="drawer-form-buttom-group">
            <el-button type="primary" @click="drawerShow = false">确定</el-button>
          </div>
        </el-form>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import { roomView, companyList, roomEdit } from '@/api/conferenceRoom'
import { sign } from '@/api/common'
export default {
  filters: {
    stateFilter(e) {
      if (!e) {
        return '通过'
      } else if (e == 1) {
        return '未审核'
      } else {
        return '未通过'
      }
    }
  },
  props: {
    isExamine: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      drawerShow: false,
      title: '',
      dataBody: null,
      form: {
        state: '0',
        remark: ''
      },
      positiveFile: '',
      backFile: '',
      license: [],
      editFlag: false,
      companyList: []
    }
  },
  watch: {
    drawerShow(bl) {
      if (!bl) {
        this.dataBody = null
      }
    }
  },
  methods: {
    show(title, rowData) {
      this.editFlag = false;
      this.title = title
      if (title == "编辑") {
        this.editFlag = true;
      }
      this.drawerShow = true
      roomView({ id: rowData.id }).then(response => {
        let res = response.result;
        res.datetimerange = [res.effectiveBeginTime, res.effectiveEndTime]
        this.dataBody = res;
      })
      // companyList({}).then(response => {
      //   var companyList = response.result
      //   for (var i in companyList) {
      //     this.companyList.push({'label':companyList[i].enName, 'value':companyList[i].id});
      //   }
      // })
    },
    examineAction() {
      console.log(this.form)
      var param = {
        id: this.dataBody.id,
        effectiveBeginTime: this.dataBody.datetimerange[0],
        effectiveEndTime: this.dataBody.datetimerange[1],
        // isPlatform: this.dataBody.isPlatform,
        // companyId: this.dataBody.companyId,
        status: this.dataBody.status
      };
      roomEdit(param).then(response => {
        console.log(response);
        this.$message({
          type: 'success',
          message: '编辑成功!'
        })
        this.drawerShow = false
        this.$emit('refresh')
      })
    }
  }
}
</script>

<style lang="scss" scoped>
  .form-title{
    margin: 15px 0 25px 0;
  }
  .upload-wrap{
    .el-upload-list--picture-card::after{
      display: block;
      content: "";
      clear: both;
    }
    ::v-deep .el-upload-list--picture-card{
      margin-bottom: -10px;
    }
    ::v-deep .el-upload-list--picture-card .el-upload-list__item{
      width: 100px;
      height: 100px;
      margin-bottom: 10px;
      float: left;
      position: relative;
      .el-progress-circle{
        display: none !important;
      }
    }
    ::v-deep .el-upload{
      width: 100px;
      height: 100px;
      border: 1px dashed #d9d9d9;
      cursor: pointer;
      position: relative;
      border-radius: 6px;
      background: none;
      .uploader-item-icon {
        display: block;
        font-size: 28px;
        color: #8c939d;
        width: 100px;
        height: 100px;
        line-height: 100px;
        text-align: center;
      }
    }
    .tips{
      margin: 0;
      margin-top: 10px;
      line-height: 24px;
    }
  }
  .avatar {
    width: 100px;
    height: 100px;
    margin-bottom: 10px;
    margin-right: 10px;
    float: left;
    display: block;
  }
</style>
